<template>
    <h2 style="align-items: center;">仓库信息</h2>
    <el-form :model="form" label-width="auto" style="max-width: 600px">
        <table>
            <tr>
                <td>
                    <el-form-item label="仓库编号">
                        <el-input v-model="form.updDto.wNumber" />
                    </el-form-item>
                </td>
                <td>
                    <el-form-item label="仓库名称">
                        <el-input v-model="form.updDto.wName" />
                    </el-form-item>
                </td>
            </tr>
            <tr>
                <td>
                    <el-form-item label="所属类别">
                        <el-input v-model="form.wTypes" @dblclick="dialogProductTypeSelect = true" />
                    </el-form-item>
                </td>
                <td>
                    <el-form-item label="仓库地址">
                        <el-input v-model="form.updDto.wAddress" />
                    </el-form-item>
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    <el-form-item label="备注">
                        <el-input v-model="form.updDto.warehouseRemark" type="textarea" />
                    </el-form-item>
                </td>
            </tr>
            <tr>
                <el-form-item>
                    <el-button type="primary" @click="onSubmit">保存</el-button>
                    <el-button @click="onCancel">取消</el-button>
                </el-form-item>
            </tr>
        </table>
    </el-form>




    <!-- 新增产品分类时双击上级类别弹出选择产品分类的弹窗 -->
    <el-dialog v-model="dialogProductTypeSelect" title="仓库分类选择" width="500" :before-close="ProductTypeSelectOver">
        <template #footer>
            <div class="dialog-footer">
                <el-table :data="tableData" border style="width: 100%" @selection-change="ProductsTypeChange">
                    <el-table-column type="selection" width="55" />
                    <el-table-column prop="value" label="序号" />
                    <el-table-column prop="label" label="仓库分类名称" />
                </el-table>
                <el-button @click="dialogProductTypeSelectOver()">确定</el-button>
            </div>
        </template>
    </el-dialog>

</template>
<script setup lang="ts">
import {
    Check,
    Delete,
    Edit,
    Message,
    Search,
    Star,
} from '@element-plus/icons-vue'
import { onMounted, ref, reactive } from "vue";
import type { ComponentSize, FormInstance, FormRules } from 'element-plus'
import { useRoute, useRouter } from "vue-router";
import { ElMessage, ElMessageBox } from "element-plus";
import axios from "axios";
const route = useRoute();
const router = useRouter();
var dates = new Date();
import http from '../../../http.js'
const form = reactive({
    wTypes: '',
    "updDto": {
        "warehouseId": route.query.warehouseId,
        "wNumber": "string",
        "wName": "string",
        "wType": 0,
        "wAddress": "string",
        "warehouseRemark": "string",
        "addName": "string",
        "addTime": "2024-12-16T12:44:22.726Z",
        "updName": "string",
        "updTime": "2024-12-16T12:44:22.726Z",
        "delName": "string",
        IsDel: false,
        "delTime": "2024-12-16T12:44:22.726Z",
        "office_Id": "string",
        "user_Id": 0
    }
})




const tableData = ref([])

onMounted(() => {
    FanWarehouse();
    WarehouseTypeSelect();
})
var warehouseId = route.query.warehouseId;
//反填

const FanWarehouse = () => {
    axios.get(http.zblnb+'/erpck/api/Warehouse/FillWarehouse?WarehouseId=' + warehouseId).then((res) => {
        var wtypelists = '';
        switch (res.data.data.wType) {
            case 1:
                wtypelists = '成品区'
                break;
            case 2:
                wtypelists = '待检验'
                break;
            case 3:
                wtypelists = '生产车间线边库'
                break;
            case 4:
                wtypelists = '良品区'
                break;
            case 8:
                wtypelists = '不良品仓库'
                break;
            case 6:
                wtypelists = '半成品仓库'
                break;
        }
        form.updDto.warehouseId = route.query.warehouseId
        form.wTypes = wtypelists
        form.updDto.wNumber = res.data.data.wNumber
        form.updDto.wType = res.data.data.wType
        form.updDto.wName = res.data.data.wName
        form.updDto.wAddress = res.data.data.wAddress
        form.updDto.IsDel = res.data.data.IsDel
        form.updDto.warehouseRemark = res.data.data.warehouseRemark
        form.updDto.addName = res.data.data.addName
        form.updDto.addTime = res.data.data.addTime
    })
}

//修改
const onSubmit = () => {
    axios.put(http.zblnb+'/erpck/api/Warehouse/UptWarehouse', {
        updDto: form.updDto
    }).then((res) => {
        if (res.data.data > 0) {
            ElMessage.success('修改成功')
            router.push('ShowWarehouse')
        } else {
            ElMessage.error('修改失败')
        }
    })
}

//弹出层显示仓库分类信息
const WarehouseTypeSelect = () => {
    axios.get(http.zblnb+'/erpck/api/WareType/GetWareTypeSelectList').then((res) => {
        tableData.value = res.data.data
    })
    console.log(tableData.value)
}
// 新增产品分类下拉弹出层
const dialogProductTypeSelect = ref(false)
//新增产品分类下拉弹出层关闭弹出层
const ProductTypeSelectOver = (done: () => void) => {
    ElMessageBox.confirm('确认关闭吗?')
        .then(() => {
            done()
        })
        .catch(() => {
            // catch error
        })
}
//表格多选获取值
const ProductTypeSelectChangeInfo = ref([])
const ProductsTypeChange = (val: any) => {
    ProductTypeSelectChangeInfo.value = val[0]
}
//关闭弹出层后，反填产品分类上级名称
const dialogProductTypeSelectOver = () => {
    form.wTypes = ProductTypeSelectChangeInfo.value.label
    form.updDto.wType = ProductTypeSelectChangeInfo.value.value
    dialogProductTypeSelect.value = false
}
//取消
const onCancel = () => {
    router.push('/ShowWarehouse')
}
</script>